<template>
	<div class="vert-wrap">
		<component :is="comItem.componentName"  @goodsItemDetail="openCart" v-for="(comItem, index) in list" :key="index" :configData="comItem.data"></component>
		<product-picker v-if="productPickerModal" v-model="productPickerModal" :goods-item-detail="goodsItemDetail"></product-picker>
	</div>
</template>
<script type="text/javascript">
	export default {
		name: 'theme',
		props: {
			pageData: {
				type: Object,
				default() {
					return {
						list: []
					}
				}
			}
		},
		data() {
			return {
				list: this.pageData.list,
				productPickerModal: false,
				goodsItemDetail: null
			}
		},
		methods: {
			openCart(goodsItem) {
	            this.goodsItemDetail = goodsItem;
	            this.productPickerModal = true;
	        }
        }
	}
</script>